<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="/includes/common.jsp" %>

<script type="text/javascript">
<!--
function toggle(id) {
	var elem = document.getElementById(id);
	if (elem.style.display == 'block') {
		elem.style.display = 'none';
	} else {
		elem.style.display = 'block';
	}
}
//-->
</script>

<div style="color:red">
<c:forEach var="warning" items="${action.warnings}">
	<p>${warning}</p>
</c:forEach>
</div>

<h3>Danh sách món ăn:</h3>
<ol>
<c:forEach var="recipeEntry" items="${action.recipeMap}">
	<li>
		<a href="#" onclick="toggle('${recipeEntry.key}-attribs');return false;">${recipeEntry.key}</a>
		<ul id="${recipeEntry.key}-attribs" style="display: none;">
		<c:forEach var="attribEntry" items="${recipeEntry.value}">
			<li>${attribEntry.value}</li>
		</c:forEach>
		</ul>
	</li>
</c:forEach>
</ol>